<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
    <el-tab-pane label="基本信息登记 " name="first">
      <el-form
        ref="ruleForm"
        :model="ruleForm"
        :rules="rules"
        label-width="100px"
        class="demo-ruleForm"
        size="medium"
      >
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="ruleForm.name" placeholder="请输入姓名"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="身份证" prop="id_card">
              <el-input
                v-model="ruleForm.id_card"
                placeholder="请输入身份证号"
                :rules="[
                  {
                    required: true,
                    message: '请输入身份证号',
                    trigger: 'blur',
                  },
                ]"
                @change="handleChangeCard"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="出生日期" prop="birthday">
              <el-date-picker
                v-model="ruleForm.birthday"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
                placeholder="选择日期时间"
                :picker-options="dataBeforeTodayOptions"
                style="width: 100%;"
                @change="handleBirthdayToage"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="年龄" prop="age">
              <el-input v-model="ruleForm.age" placeholder="请输入年龄"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="性别" prop="sex">
              <el-select
                v-model="ruleForm.sex"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="男" :value="1"></el-option>
                <el-option :key="1" label="女" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="联系方式" prop="mobile">
              <el-input v-model="ruleForm.mobile"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="宗教信仰" prop="religion">
              <el-select
                v-model="ruleForm.religion"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="佛教" :value="1"></el-option>
                <el-option :key="1" label="道教" :value="2"></el-option>
                <el-option :key="2" label="基督教" :value="3"></el-option>
                <el-option :key="3" label="伊斯兰教" :value="4"></el-option>
                <el-option :key="4" label="其他" :value="5"></el-option>
                <el-option :key="5" label="无宗教信仰" :value="6"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="民族" prop="nation">
              <el-select
                v-model="ruleForm.nation"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.nation"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="婚姻状态" prop="marry">
              <el-select
                v-model="ruleForm.marry"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.marry"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="老人类型" prop="type">
              <el-select
                v-model="ruleForm.type"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.olderType"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="居住情况" prop="live_status">
              <el-select
                v-model="ruleForm.live_status"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.live_status"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="经济来源" prop="finance_source">
              <el-select
                v-model="ruleForm.finance_source"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.finance_source"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="劳动能力" prop="work">
              <el-select
                v-model="ruleForm.work"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.work"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="文化程度" prop="edu">
              <el-select
                v-model="ruleForm.edu"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.edu"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="医疗保障" prop="medical_security">
              <el-select
                v-model="ruleForm.medical_security"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.medical_security"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="医保卡号" prop="medical_number">
              <el-input v-model="ruleForm.medical_number"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="所在地" prop="areaArr">
              <el-cascader
                ref="cascaderAddr1"
                v-model="ruleForm.areaArr"
                :options="addressData"
                :show-all-levels="true"
                :props="{ expandTrigger: 'hover' }"
                style="width: 100%;"
                @change="handleChangeAddress"
              ></el-cascader>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="详细地址" prop="address">
              <el-input v-model="ruleForm.address"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="获取经纬度" prop="lat">
              <el-row>
                <el-col :xs="5" :sm="5" :md="5" :lg="5" :xl="5">
                  <el-input v-model="ruleForm.lat" :disabled="true"></el-input>
                </el-col>
                <el-col
                  :xs="1"
                  :sm="1"
                  :md="1"
                  :lg="1"
                  :xl="1"
                  style="text-align: center;"
                >
                  --
                </el-col>
                <el-col :xs="5" :sm="5" :md="5" :lg="5" :xl="5">
                  <el-input v-model="ruleForm.lng" :disabled="true"></el-input>
                </el-col>
                <el-col
                  :xs="1"
                  :sm="1"
                  :md="1"
                  :lg="1"
                  :xl="1"
                  style="text-align: center;"
                >
                  -
                </el-col>
                <el-col :xs="5" :sm="5" :md="5" :lg="5" :xl="5">
                  <el-button size="medium" type="primary" @click="handleMap">
                    获取经纬度
                  </el-button>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter" style="margin-bottom: 20px;">
          <el-col :offset="1" :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-tooltip class="item" effect="dark" content="请先下载安装摄像头驱动程序，再尝试打开摄像头，如已安装请忽略" placement="top-start">
                <el-button size="medium" type="primary" @click="handleClickPhoto(true)">开启拍照功能</el-button>
              </el-tooltip>
              <el-button size="medium" type="primary" @click="handleClickPhoto(false)">关闭拍照功能</el-button>
              <el-tooltip class="item" effect="dark" content="下载驱动后请安装" placement="top-start">
                <el-button size="medium">
                  <a href="http://test.yanglao12349.com/摄像头驱动程序.exe">下载驱动</a>
                </el-button>
              </el-tooltip>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="老人照片" prop="avatar">
              <el-row>
                <el-col :xs="9" :sm="9" :md="9" :lg="9" :xl="9">
                <div @click="handleResultAvatar">
                  <img-upload
                    v-model="ruleForm.profile"
                    tips="老人照片"
                    method="profile"
                    :imgurl="profile_img"
                    :updisabled="upDisabled"
                    @result="resultAvatar"
                  ></img-upload>
                </div>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="证件照" prop="id_card_front">
              <el-row>
                <el-col :xs="9" :sm="9" :md="9" :lg="9" :xl="9">
                  <div @click="handleResultFront">
                    <img-upload
                      v-model="ruleForm.id_card_front"
                      tips="身份证正面"
                      method="id_card"
                      :imgurl="id_card_front_img"
                      :updisabled="upDisabled"
                      @result="resultFront"
                    ></img-upload>
                  </div>
                </el-col>
                <el-col :xs="9" :sm="9" :md="9" :lg="9" :xl="9">
                  <div @click="handleResultBack">
                    <img-upload
                      v-model="ruleForm.id_card_back"
                      tips="身份证反面"
                      method="id_card"
                      :imgurl="id_card_back_img"
                      :updisabled="upDisabled"
                      @result="resultBack"
                    ></img-upload>
                  </div>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">

        </el-row>
      </el-form>
      <div class="form-footer">
        <el-button type="primary" class="sureBtn" size="medium" @click="save(0)">
          提 交
        </el-button>
        <el-button type="primary" class="sureBtn" size="medium" @click="save(1)">
          提交并进入下一步
        </el-button>
        <el-button
          type="info"
          class="setBtn"
          size="medium"
          @click="cancel('ruleForm')"
        >
          重 置
        </el-button>
      </div>
      <div v-show="cameraDialog" class="cameraDialog_wrap" @touchmove.prevent @mousewheel.prevent>
        <el-select v-model="capType" placeholder="请选择" @change="handleChangeCap">
          <el-option key="0" label="老人照片" value="profile"></el-option>
          <el-option key="1" label="身份证正面" value="id_card_front">身份证正面</el-option>
          <el-option key="2" label="身份证反面" value="id_card_back">身份证反面</el-option>
        </el-select>
        <el-button type="primary" :loading="captureLoading" @click="Capture">{{captureLoading ? '正在上传中' : '拍照并上传'}}</el-button>
        <div id="ActiveXDivOne" ref="ActiveXDivOne" width="100%" height="400px"></div>
      </div>
    </el-tab-pane>
    <el-tab-pane label="家属信息登记 " name="second">
      <el-form
        ref="relateForm"
        :model="relateForm"
        :rules="rules"
        label-width="100px"
        class="demo-ruleForm"
        size="medium"
      >
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="relateForm.name"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="性别" prop="sex">
              <el-select
                v-model="relateForm.sex"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="男" :value="1"></el-option>
                <el-option :key="1" label="女" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="手机" prop="mobile">
              <el-input v-model="relateForm.mobile"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="身份证" prop="id_card">
              <el-input v-model="relateForm.id_card"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="亲属关系" prop="related">
              <el-select
                v-model="relateForm.related"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.related"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="是否监护人" prop="is_jh">
              <el-select
                v-model="relateForm.is_jh"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="是" :value="1"></el-option>
                <el-option :key="1" label="否" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="紧急联系人" prop="is_main">
              <el-select
                v-model="relateForm.is_main"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="是" :value="1"></el-option>
                <el-option :key="1" label="否" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="详细地址" prop="address">
              <el-input v-model="relateForm.address"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="form-footer">
        <el-button
          type="primary"
          class="sureBtn"
          size="medium"
          @click="relateSave(0)"
        >
          提 交
        </el-button>
        <el-button type="primary" class="sureBtn" size="medium" @click="relateSave(1)">
          提交并进入下一步
        </el-button>
        <el-button
          type="info"
          class="setBtn"
          size="medium"
          @click="cancel('relateForm')"
        >
          重 置
        </el-button>
      </div>
    </el-tab-pane>
    <el-tab-pane label="健康状况登记 " name="third">
      <el-form
        ref="healthForm"
        :model="healthForm"
        :rules="rules"
        label-width="100px"
        class="demo-ruleForm"
        size="medium"
      >
        <div class="diver-title">个人健康情况</div>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="介护等级" prop="dj">
              <el-select
                v-model="healthForm.dj"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.dj"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="听力" prop="tl">
              <el-select
                v-model="healthForm.tl"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.tl"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="视力" prop="sl">
              <el-select
                v-model="healthForm.sl"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option
                  v-for="(item, index) in dictDatas.sl"
                  :key="index"
                  :label="item"
                  :value="index + 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="体重" prop="tz">
              <el-input v-model="healthForm.tz"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="传染病" prop="crb">
              <el-select
                v-model="healthForm.crb"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="有" :value="1"></el-option>
                <el-option :key="1" label="无" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="过敏史" prop="gms">
              <el-select
                v-model="healthForm.gms"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="有" :value="1"></el-option>
                <el-option :key="1" label="无" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="遗传病史" prop="ycb">
              <el-select
                v-model="healthForm.ycb"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="有" :value="1"></el-option>
                <el-option :key="1" label="无" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="主要疾病" prop="jbArr">
              <el-checkbox-group v-model="healthForm.jbArr">
                <el-checkbox label="高血压" value="1"></el-checkbox>
                <el-checkbox label="高血糖" value="2"></el-checkbox>
                <el-checkbox label="高血脂" value="3"></el-checkbox>
                <el-checkbox label="糖尿病" value="4"></el-checkbox>
                <el-checkbox label="脑血栓" value="5"></el-checkbox>
                <el-checkbox label="心梗" value="6"></el-checkbox>
                <el-checkbox label="冠心病" value="7"></el-checkbox>
                <el-checkbox label="颈椎病" value="8"></el-checkbox>
                <el-checkbox label="痛风" value="9"></el-checkbox>
                <el-checkbox label="帕金森" value="10"></el-checkbox>
                <el-checkbox label="老年痴呆症" value="11"></el-checkbox>
                <el-checkbox label="腰间盘突出" value="12"></el-checkbox>
                <el-checkbox label="中风" value="13"></el-checkbox>
                <el-checkbox label="骨质疏松" value="14"></el-checkbox>
                <el-checkbox label="尿失禁" value="15"></el-checkbox>
                <el-checkbox label="便秘" value="16"></el-checkbox>
                <el-checkbox label="肾结石" value="17"></el-checkbox>
                <el-checkbox label="肺气肿" value="18"></el-checkbox>
                <el-checkbox label="肩周炎" value="19"></el-checkbox>
                <el-checkbox label="慢性胃炎" value="20"></el-checkbox>
                <el-checkbox label="消化性溃疡" value="21"></el-checkbox>
                <el-checkbox label="慢性肝炎" value="22"></el-checkbox>
                <el-checkbox label="慢性肾炎" value="23"></el-checkbox>
                <el-checkbox label="慢性支气管炎" value="24"></el-checkbox>
                <el-checkbox label="慢性肾功能衰竭" value="25"></el-checkbox>
                <el-checkbox label="慢性腹泻" value="26"></el-checkbox>
                <el-checkbox label="慢性胰腺炎" value="27"></el-checkbox>
                <el-checkbox label="慢性胆囊炎" value="28"></el-checkbox>
                <el-checkbox label="风湿性关节炎" value="29"></el-checkbox>
                <el-checkbox label="前列腺炎" value="30"></el-checkbox>
                <el-checkbox label="前列腺增生" value="31"></el-checkbox>
                <el-checkbox label="肠结核" value="32"></el-checkbox>
                <el-checkbox label="尿毒症" value="33"></el-checkbox>
                <el-checkbox label="心脏病" value="34"></el-checkbox>
                <el-checkbox label="哮喘" value="35"></el-checkbox>
                <el-checkbox label="贫血" value="36"></el-checkbox>
                <el-checkbox label="心机梗塞" value="37"></el-checkbox>
                <el-checkbox label="皮肤病" value="38"></el-checkbox>
                <el-checkbox label="其他" value="39"></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="diver-title">家族病史</div>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="父亲" prop="f">
              <el-select
                v-model="healthForm.f"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="有" :value="1"></el-option>
                <el-option :key="1" label="无" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="母亲" prop="m">
              <el-select
                v-model="healthForm.m"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="有" :value="1"></el-option>
                <el-option :key="1" label="无" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="兄弟姐妹" prop="idfer">
              <el-select
                v-model="healthForm.gender"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="有" :value="1"></el-option>
                <el-option :key="1" label="无" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="子女" prop="z">
              <el-select
                v-model="healthForm.x"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
              >
                <el-option :key="0" label="有" :value="1"></el-option>
                <el-option :key="1" label="无" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="备注" prop="remark">
              <el-input
                v-model="healthForm.remark"
                :rows="5"
                type="textarea"
              ></el-input>
            </el-form-item>
            <div class="tips">
              注：凡因对病史有所隐瞒所产生的一切后果，均由家属自行负责。
            </div>
          </el-col>
        </el-row>
      </el-form>
      <div class="form-footer">
        <el-button
          type="primary"
          class="sureBtn"
          size="medium"
          @click="healthSave(0)"
        >
          提 交
        </el-button>
        <el-button type="primary" class="sureBtn" size="medium" @click="healthSave(1)">
          提交并进入下一步
        </el-button>
        <el-button
          type="info"
          class="setBtn"
          size="medium"
          @click="cancel('healthForm')"
        >
          重 置
        </el-button>
      </div>
    </el-tab-pane>
    <!-- <el-tab-pane v-if="styletype === 0" label="入住交费" name="fourth">
      <el-form
        ref="liveForm"
        :model="liveForm"
        :rules="rules"
        label-width="100px"
        class="demo-ruleForm"
        size="medium"
      >
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="床位选择" prop="floor_ids">
              <el-cascader
                ref="cascaderAddr"
                v-model="liveForm.floor_ids"
                :options="options"
                :props="{ expandTrigger: 'hover' }"
                style="width: 100%;"
                @change="handleChange"
              ></el-cascader>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="床位类型" prop="bed_name">
              <el-input v-model="liveForm.bed_name" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="床位费用" prop="price">
              <el-input v-model="liveForm.price" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="床位押金" prop="deposit">
              <el-input v-model="liveForm.deposit" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="餐费" prop="meal_id">
              <el-select
                v-model="liveForm.meal_id"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
                @change="handleFood"
              >
                <el-option
                  v-for="(item, index) in foodData"
                  :key="index"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="餐费价格" prop="meal_name">
              <el-input
                v-model="liveForm.meal_name"
                :disabled="true"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="护理费" prop="care_id">
              <el-select
                v-model="liveForm.care_id"
                clearable
                placeholder="请选择"
                filterable
                style="width: 100%;"
                @change="handleNursing"
              >
                <el-option
                  v-for="(item, index) in nursingData"
                  :key="index"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="护理费价格" prop="care_name">
              <el-input
                v-model="liveForm.care_name"
                :disabled="true"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="入住时间" prop="live_time">
              <el-date-picker
                v-model="liveForm.live_time"
                value-format="yyyy-MM-dd"
                format="yyyy 年 MM 月 dd 日"
                placeholder="选择日期时间"
                :picker-options="dataPickerBeforeTodayOptions"
                style="width: 100%;"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="离住时间" prop="leave_time">
              <el-date-picker
                v-model="liveForm.leave_time"
                value-format="yyyy-MM-dd"
                format="yyyy 年 MM 月 dd 日"
                placeholder="选择日期时间"
                :picker-options="dataPickerBeforeTodayOptions"
                style="width: 100%;"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="预交金额" prop="amount">
              <el-input v-model="liveForm.amount"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="预警金额" prop="warning_amount">
              <el-input v-model="liveForm.warning_amount"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="form-footer">
        <el-button
          type="primary"
          class="sureBtn"
          size="medium"
          @click="feesSave(0)"
        >
          提 交
        </el-button>
        <el-button
          type="info"
          class="setBtn"
          size="medium"
          @click="cancel('liveForm')"
        >
          重 置
        </el-button>
      </div>
    </el-tab-pane> -->
    <el-tab-pane v-if="styletype === 1" label="入住交费" name="fourth">
      <el-form
        ref="liveForm"
        :model="liveForm"
        :rules="rules"
        label-width="100px"
        class="demo-ruleForm"
        size="medium"
      >
        <el-row :gutter="gutter">
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="床位选择" prop="floor_idsArr">
              <el-cascader
                ref="cascaderAddr"
                v-model="liveForm.floor_idsArr"
                :options="options"
                :props="{ expandTrigger: 'hover' }"
                style="width: 100%;"
                @change="handleChange"
              ></el-cascader>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="押金" prop="amount">
              <el-input v-model="liveForm.amount"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="入住时间" prop="live_time">
              <el-date-picker
                v-model="liveForm.live_time"
                value-format="yyyy-MM-dd"
                format="yyyy 年 MM 月 dd 日"
                placeholder="选择日期时间"
                :picker-options="dataPickerBeforeTodayOptions"
                style="width: 100%;"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
            <el-form-item label="离住时间" prop="leave_time">
              <el-date-picker
                v-model="liveForm.leave_time"
                value-format="yyyy-MM-dd"
                format="yyyy 年 MM 月 dd 日"
                placeholder="选择日期时间"
                :picker-options="dataPickerBeforeTodayOptions"
                style="width: 100%;"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="form-footer">
        <el-button
          type="primary"
          class="sureBtn"
          size="medium"
          @click="feesSave(0)"
        >
          提 交
        </el-button>
        <el-button type="primary" class="sureBtn" size="medium" @click="feesSave(1)">
          完成登记
        </el-button>
        <el-button
          type="info"
          class="setBtn"
          size="medium"
          @click="cancel('liveForm')"
        >
          重 置
        </el-button>
      </div>
    </el-tab-pane>
  </el-tabs>
</template>
<script>
  import { isIdCard, isPhone } from "@/utils/validate";
  import { getCarddetail, getBirthdayage } from "@/utils";
  import { getList, getFamily, getHealth, getFees } from "@/api/trymanager";
  import { getListFood } from "@/api/foodcost";
  import { getListNursing } from "@/api/nursingcost";
  import { getBed } from "@/api/building";
  import { getData } from "@/api/floorData";
  import imgUpload from "@/components/AppUpload/index";
  import dictData from "@/utils/dictionary";
  import addressData from "@/utils/address";
  import { uploadImg, getidcardapi } from "@/api/oldermanager";
  export default {
    name: "Index",
    components: { imgUpload },
    props: {
      data: {
        type: Object,
        default() {
          return {};
        },
      },
      gutter: {
        type: Number,
        default: 100,
      },
      styletype: {
        type: Number,
        default: 0,
      },
    },
    data() {
      const validateCard = (rule, value, callback) => {
        if (!isIdCard(value)) {
          callback(new Error("请输入正确的身份证"));
        } else {
          callback();
        }
      };
      const validatePhone = (rule, value, callback) => {
        if (!isPhone(value)) {
          callback(new Error("请输入正确的手机号"));
        } else {
          callback();
        }
      };
      return {
        baseId: "",
        activeName: "first",
        areaString: "",
        options: [],
        addressData: [],
        nursingData: [],
        foodData: [],
        liveForm: {},
        tryForm: {},
        ruleForm: {},
        bedForm: {},
        relateForm: {},
        healthForm: {
          jbArr: [],
        },
        rules: {
          name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
          age: [{ required: true, message: "请输入年龄", trigger: "blur" }],
          sex: [{ required: true, message: "请选择性别", trigger: "change" }],
          mobile: [
            { required: true, message: "请输入电话", trigger: "blur" },
            { validator: validatePhone, trigger: "blur" },
          ],
          id_card: [
            { required: true, message: "请输入身份证", trigger: "blur" },
            { validator: validateCard, trigger: "blur" },
          ],
          related: [
            { required: true, message: "请选择亲属关系", trigger: "change" },
          ],
          is_jh: [
            { required: true, message: "请选择亲属关系", trigger: "change" },
          ],
          birthday: [
            { required: true, message: "请选择出生日期", trigger: "change" },
          ],
          type: [
            { required: true, message: "请选择老人类型", trigger: "change" },
          ],
          areaArr: [
            { required: true, message: "请选择省市", trigger: "change" },
          ],
          address: [{ required: true, message: "请输入地址", trigger: "blur" }],
          dj: [
            { required: true, message: "请选择介护等级", trigger: "change" },
          ],
          tl: [{ required: true, message: "请选择", trigger: "change" }],
          sl: [{ required: true, message: "请选择", trigger: "change" }],
          tz: [{ required: true, message: "请选择", trigger: "change" }],
          crb: [{ required: true, message: "请选择", trigger: "change" }],
          gms: [{ required: true, message: "请选择", trigger: "change" }],
          ycb: [{ required: true, message: "请选择", trigger: "change" }],
          jbArr: [{ required: true, message: "请选择", trigger: "change" }],
          f: [{ required: true, message: "请选择", trigger: "change" }],
          m: [{ required: true, message: "请选择", trigger: "change" }],
          x: [{ required: true, message: "请选择", trigger: "change" }],
          floor_idsArr: [
            { required: true, message: "请选择", trigger: "change" },
          ],
          care_id: [{ required: true, message: "请选择", trigger: "change" }],
          meal_id: [{ required: true, message: "请选择", trigger: "change" }],
          live_time: [{ required: true, message: "请选择", trigger: "change" }],
          leave_time: [
            { required: true, message: "请选择", trigger: "change" },
          ],
          amount: [{ required: true, message: "请填写金额", trigger: "blur" }],
          warning_amount: [
            { required: true, message: "请填写金额", trigger: "blur" },
          ],
        },

        dataPickerBeforeTodayOptions: {
          disabledDate(time) {},
        },
        dataBeforeTodayOptions: {
          disabledDate(time) {
            return time.getTime() > Date.now();
          },
        },
        dictDatas: {},
        cameraDialog: false,
        camPlugins: {},
        upDisabled: false,
        methodType: "profile",
        profile_img: "",
        id_card_front_img: "",
        id_card_back_img: "",
        captureLoading: false,
        capType: "profile",
      };
    },
    watch: {
      data: {
        //监听的对象
        deep: true, //深度监听设置为 true
        handler: function (newV, oldV) {
          // console.log("watch中：", newV, oldV);
          if (JSON.stringify(newV) != "{}") {
            this.$set(this.ruleForm, "lng", newV.base.lng);
            this.$set(this.ruleForm, "address", newV.base.address);
            this.$set(this.ruleForm, "lat", newV.base.lat);
          }
        },
      },
    },
    created() {},
    beforeDestroy() {},
    mounted() {
      this.dictDatas = dictData;
      this.addressData = addressData;
      this.getData();
      this.getFoodData();
      this.getNursingData();
      if (JSON.stringify(this.data) !== "{}") {
        if (this.data.base && JSON.stringify(this.data.base) != "{}") {
          this.ruleForm = this.data.base;
          let areaArr = [];
          if (this.ruleForm.area) areaArr = this.data.base.area.split(",");
          this.$set(this.ruleForm, "areaArr", areaArr);
          if (this.data.base.id) this.baseId = this.ruleForm.id;
          this.areaString = this.ruleForm.area_name;
          // console.log(this.ruleForm);
        }
        if (this.data.fees && JSON.stringify(this.data.fees) != "{}") {
          this.liveForm = this.data.fees;
          let floor_idsArr = [];
          console.log(this.liveForm.floor_ids);
          if (this.liveForm.floor_ids)
            floor_idsArr = this.liveForm.floor_ids.split(",");
          this.$set(this.liveForm, "floor_idsArr", floor_idsArr);
          let params = {
            id: floor_idsArr[floor_idsArr.length - 1],
          };
          this.getBedData(params);
        }

        if (this.data.bed && JSON.stringify(this.data.bed) != "{}")
          this.bedForm = this.data.bed;
        if (this.data.family && JSON.stringify(this.data.family) != "{}")
          this.relateForm = this.data.family;
        if (this.data.health && JSON.stringify(this.data.health) != "{}") {
          this.healthForm = this.data.health;
          let jbArr = [];
          if (this.healthForm.jb) jbArr = this.healthForm.jb.split(",");
          this.$set(this.healthForm, "jbArr", jbArr);
        }
      }
      this.$nextTick(() => {
        if(this.$refs.ActiveXDivOne) {
          // this.upDisabled = true;
          const _this = this;
          this.camPlugins = new CarmerPlugins({camidMain: 1}, function(obj){
            obj.StartVideo()
            // _this.upDisabled = true;
            _this.camPlugins.ChangeDevice(1)
          });
        }
      })
    },
    methods: {
      handleChangeCap(value) {
        if(value == "profile"){
          this.camPlugins.ChangeDevice(1)
        } else {
          this.camPlugins.ChangeDevice(0)
        }
        this.methodType = value
      },
      handleClickPhoto(bool) {
        this.$nextTick(() => {
          if(bool) {
            this.camPlugins.ChangeDevice(1)
            if(!this.camPlugins.obj.success) {
              this.upDisabled = false;
              this.cameraDialog = false;
              this.$message.error("请先连接设备，再进行拍照")
            } else {
              this.upDisabled = true;
              this.cameraDialog = true;
            }
          } else {
            this.upDisabled = false;
            this.cameraDialog = false;
            this.camPlugins.ChangeDevice(2)
          }
        })
      },
      //拍照
      Capture() {
        const _this = this;
        this.camPlugins.Capture();
        this.captureLoading = true;
        setTimeout(function() {
          _this.funUpdataBase64()
        }, 1500)
      },
      //上传图片
      funUpdataBase64() {
        let strImgBase64 = this.camPlugins.obj.base64Data.split(',')[1];
        let $Blob = getBlobBydataURI(strImgBase64, 'image/jpeg');
        let formData = new FormData();
        formData.append("file", $Blob, "file_" + Date.parse(new Date()) + ".jpeg");
        let methodType = this.methodType == "profile" ? 'profile' : 'id_card';
        formData.append("method", methodType)
        uploadImg("post", formData).then(res => {
          this.captureLoading = false;
          const data = res.data;
          if(this.methodType == "profile") {
            this.$set(this.ruleForm, "profile_id", data.id);
            this.profile_img = this.camPlugins.obj.base64Data;
          } else if(this.methodType == "id_card_front"){
            this.$set(this.ruleForm, "front_id", data.id);
            this.id_card_front_img = this.camPlugins.obj.base64Data;
          } else {
            this.$set(this.ruleForm, "back_id", data.id);
            this.id_card_back_img = this.camPlugins.obj.base64Data;
          }
          let dataBase64 = (this.camPlugins.obj.base64Data.split(',')[1]).replace(/\r/g, "");
          if(this.camPlugins.obj.base64Data && this.methodType == "id_card_front"){
            getidcardapi("post", {
              img: dataBase64,
            }).then(res => {
              const data = JSON.parse(res.data);
              console.log(data)
              if(data.image_status == 'normal') {
                this.$set(this.ruleForm, "name", data.words_result["姓名"].words);
                this.$set(this.ruleForm, "id_card", data.words_result["公民身份号码"].words);
                this.handleChangeCard(data.words_result["公民身份号码"].words)
                this.$set(this.ruleForm, "nation", data.words_result["民族"].words);
              }
              switch (data.image_status) {
                case 'normal':
                  this.$message({
                    type: "success",
                    message: "识别完成",
                  });
                  break;
                case 'reversed_side':
                  this.$message({
                    type: "success",
                    message: "身份证正反面颠倒",
                  });
                  break;
                case 'non_idcard':
                  this.$message({
                    type: "success",
                    message: "上传的图片中不包含身份证",
                  });
                  break;
                case 'blurred':
                  this.$message({
                    type: "success",
                    message: "身份证模糊",
                  });
                  break;
                case 'other_type_card':
                  this.$message({
                    type: "success",
                    message: "请放至居民身份证进行拍照",
                  });
                  break;
                case 'over_exposure':
                  this.$message({
                    type: "success",
                    message: "身份证曝光严重，无法识别",
                  });
                  break;
                case 'over_dark':
                  this.$message({
                    type: "success",
                    message: "亮度太低，请打开光源",
                  });
                  break;
              }
              switch (data.idcard_number_type) {
                case -1:
                  this.$message({
                    type: "success",
                    message: "身份证正面所有字段全为空",
                  });
                  break;
                case 0:
                  this.$message({
                    type: "success",
                    message: "身份证证号不合法，此情况下不返回身份证证号",
                  });
                  break;
                case 2:
                  this.$message({
                    type: "success",
                    message: "身份证证号和性别、出生信息都不一致",
                  });
                  break;
                case 3:
                  this.$message({
                    type: "success",
                    message: "身份证证号和出生信息不一致",
                  });
                  break;
                case 4:
                  this.$message({
                    type: "success",
                    message: "身份证证号和性别信息不一致",
                  });
                  break;
                default:
                  break;
              }
            })
          }
        })
      },
      getData(data) {
        getData("get", data).then((resp) => {
          if (resp.code === 200) {
            // console.log(resp);
            this.options = resp.data;
          }
        });
      },
      getFoodData(data) {
        getListFood("get", data).then((resp) => {
          if (resp.code === 200) {
            this.foodData = resp.data.list;
            if (this.liveForm.meal_id) this.handleFood(this.liveForm.meal_id);
          }
        });
      },
      getNursingData(data) {
        getListNursing("get", data).then((resp) => {
          if (resp.code === 200) {
            this.nursingData = resp.data.list;
            if (this.liveForm.care_id)
              this.handleNursing(this.liveForm.care_id);
          }
        });
      },
      getBedData(data) {
        getBed("get", data).then((resp) => {
          if (resp.code === 200) {
            let data = resp.data;
            this.$set(this.liveForm, "bed_name", data.name);
            this.$set(this.liveForm, "price", data.price);
            this.$set(this.liveForm, "deposit", data.deposit);
          }
        });
      },
      save(flag) {
        // console.log(this.ruleForm);
        if (this.ruleForm.areaArr && this.ruleForm.areaArr.length > 0) {
          let area = this.ruleForm.areaArr.join(",");
          this.$set(this.ruleForm, "area", area);
        }
        this.$refs["ruleForm"].validate(async (valid) => {
          if (valid) {
            if (this.ruleForm.id) {
              getList("put", this.ruleForm).then((resp) => {
                if (resp.code === 200) {
                  this.$message({
                    type: "success",
                    message: "修改成功",
                  });
                  if (resp.data) this.baseId = resp.data.e_id;
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,家属信息
                      this.activeName = "second";
                  }
                }
              });
            } else {
              getList("post", this.ruleForm).then((resp) => {
                if (resp.code === 200) {
                  this.$message({
                    type: "success",
                    message: "添加成功",
                  });
                  if (resp.data) this.baseId = resp.data.e_id;
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,家属信息
                      this.activeName = "second";
                  }
                }
              });
            }
          }
        });
      },
      relateSave(flag) {
        console.log(this.relateForm);
        if (this.baseId == "") {
          this.$message({
            type: "warning",
            message: "请先填写基本信息",
          });
          return false;
        }
        this.$set(this.relateForm, "e_id", this.baseId);
        this.$refs["relateForm"].validate(async (valid) => {
          if (valid) {
            if (this.relateForm.id) {
              getFamily("put", this.relateForm).then((resp) => {
                if (resp.code === 200) {
                  // this.$emit("save", this.ruleForm);
                  this.$message({
                    type: "success",
                    message: "修改成功",
                  });
                  // this.$refs["relateForm"].resetFields();
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,健康状况登记
                      this.activeName = "third";
                  }
                }
              });
            } else {
              getFamily("post", this.relateForm).then((resp) => {
                if (resp.code === 200) {
                  // this.$emit("save", this.ruleForm);
                  this.$message({
                    type: "success",
                    message: "添加成功",
                  });
                  // this.$refs["relateForm"].resetFields();
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,健康状况登记
                      this.activeName = "third";
                  }
                }
              });
            }
          }
        });
      },
      healthSave(flag) {
        console.log(this.healthForm);
        if (this.baseId == "") {
          this.$message({
            type: "warning",
            message: "请先填写基本信息",
          });
          return false;
        }
        this.$set(this.healthForm, "e_id", this.baseId);
        let jb = this.healthForm.jbArr.join(",");
        this.$set(this.healthForm, "jb", jb);
        this.$refs["healthForm"].validate(async (valid) => {
          if (valid) {
            if (this.healthForm.id) {
              getHealth("put", this.healthForm).then((resp) => {
                if (resp.code === 200) {
                  // this.$emit("save", this.ruleForm);
                  this.$message({
                    type: "success",
                    message: "修改成功",
                  });
                  // this.$refs["healthForm"].resetFields();
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,费用选择
                      this.activeName = "fourth";
                  }
                }
              });
            } else {
              getHealth("post", this.healthForm).then((resp) => {
                if (resp.code === 200) {
                  // this.$emit("save", this.ruleForm);
                  this.$message({
                    type: "success",
                    message: "添加成功",
                  });
                  // this.$refs["healthForm"].resetFields();
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,费用选择
                      this.activeName = "fourth";
                  }
                }
              });
            }
          }
        });
      },
      feesSave(flag) {
        console.log("进入方法"+this.liveForm);
        if (this.baseId == "") {
          this.$message({
            type: "warning",
            message: "请先填写基本信息",
          });
          return false;
        }
        if(this.baseId){
          this.$set(this.liveForm, "e_id", this.baseId);
        }
        console.log("Id是"+this.baseId);
        console.log("字符串是"+this.liveForm.floor_idsArr);
        if (this.liveForm.floor_idsArr && this.liveForm.floor_idsArr > 0) {
          this.$set(this.liveForm, "floor_ids", this.liveForm.floor_idsArr);
        }
        this.$refs["liveForm"].validate(async (valid) => {
          if (valid) {

            if (this.liveForm.id) {
              console.log("入住费修改");
              getFees("put", this.liveForm).then((resp) => {
                if (resp.code === 200) {
                  // this.$emit("save", this.ruleForm);
                  this.$message({
                    type: "success",
                    message: "修改成功",
                  });
                  // this.$refs["healthForm"].resetFields();
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,关闭弹窗
                      this.$emit("show", false);
                  }
                }
              }).catch(function(error){
                 console.log(error);
                 this.errorMsg = error;
              });
            } else {
              console.log("入住费添加");
              getFees("post", this.liveForm).then((resp) => {
                if (resp.code === 200) {
                  // this.$emit("save", this.ruleForm);
                  this.$message({
                    type: "success",
                    message: "添加成功",
                  });
                  // this.$refs["healthForm"].resetFields();
                  //判断是否操作的是"提交并进入下一步"按钮
                  if(flag == 1){
                      //tab标签切换选中下一个,关闭弹窗
                      this.$emit("show", false);
                  }
                }
              }).catch(function(error){
                 console.log(error);
              });
            }
          }
        });
      },
      cancel(formName) {
        this.$refs[formName].resetFields();
      },
      handleClick(tab, event) {
        // console.log(tab, event);
      },
      handleChange(value, form, label) {
        this.$refs.cascaderAddr.$refs.panel.getCheckedNodes()[0].pathLabels;
        let areaString = this.$refs.cascaderAddr.$refs.panel
          .getCheckedNodes()[0]
          .pathLabels.join(",");
        this.areaString = areaString;
        if (value.length > 0) {
          let bed_id = value[value.length - 1];
          this.$set(this.liveForm, "floor_str", areaString);
          let params = {
            id: bed_id,
          };
          this.getBedData(params);
        }
      },
      handleChangeAddress(value, form, label) {
        // this.$refs.cascaderAddr1.$refs.panel.getCheckedNodes()[0].pathLabels;
        let areaString = this.$refs.cascaderAddr1.$refs.panel
          .getCheckedNodes()[0]
          .pathLabels.join(",");
        this.areaString = areaString;
      },
      handleFood(value) {
        console.log(value);
        console.log(this.foodData);
        for (let i = 0; i < this.foodData.length; i++) {
          const element = this.foodData[i];
          if (element.id == value) {
            this.$set(this.liveForm, "meal_name", element.price);
          }
        }
      },
      handleNursing(value) {
        for (let i = 0; i < this.nursingData.length; i++) {
          const element = this.nursingData[i];
          if (element.id == value) {
            this.$set(this.liveForm, "care_name", element.price);
          }
        }
      },
      handleMap() {
        if (!this.ruleForm.areaArr || this.ruleForm.areaArr == "") {
          this.$message({
            type: "warning",
            message: "请先选择所在地",
          });
          return false;
        }
        if (!this.ruleForm.address || this.ruleForm.address == "") {
          this.$message({
            type: "warning",
            message: "请先填写详细地址",
          });
          return false;
        }
        this.$emit("handleMap", this.areaString + this.ruleForm.address);
      },
      handleResultAvatar() {
        this.camPlugins.ChangeDevice(1)
        this.methodType = "profile";
        // if(!this.camPlugins.obj.success){
        //   this.upDisabled = false;
        // }else{
        //   this.upDisabled = true;
        //   this.cameraDialog = true;
        //   this.methodType = "profile";
        // }
      },
      handleResultFront() {
        this.camPlugins.ChangeDevice(0)
        this.methodType = "id_card_front";
        // if(!this.camPlugins.obj.success){
        //   this.upDisabled = false;
        // }else{
        //   this.upDisabled = true;
        //   this.cameraDialog = true;
        //   this.methodType = "id_card_front";
        // }
      },
      handleResultBack() {
        this.camPlugins.ChangeDevice(0)
        this.methodType = "id_card_back";
        // if(!this.camPlugins.obj.success){
        //   this.upDisabled = false;
        // }else{
        //   this.upDisabled = true;
        //   this.cameraDialog = true;

        // }
      },
      resultAvatar(data) {
        // console.log(data);
        this.$set(this.ruleForm, "profile_id", data.id);
      },
      resultFront(data) {
        this.$set(this.ruleForm, "front_id", data.id);
      },
      resultBack(data) {
        this.$set(this.ruleForm, "back_id", data.id);
      },
      handleChangeCard(value) {
        const userInfo = getCarddetail(value);
        if(userInfo){
          this.$set(this.ruleForm, "birthday", userInfo.birthday);
          this.$set(this.ruleForm, "age", userInfo.age);
          this.$set(this.ruleForm, "sex", userInfo.sex);
        }
      },
      handleBirthdayToage(value) {
        const age = getBirthdayage(value);
        this.$set(this.ruleForm, "age", age);
      },
    },
  };
</script>
<style lang="scss" scoped>
.cameraDialog_wrap{
  position: absolute;
  text-align: center;
  right: 8%;
  top: 46%;
  .el-select{
    float: left;
  }
  button{
    margin-left: 20px;
    float: left;
    margin-bottom: 20px;
  }
}
  .el-tabs {
    ::v-deep {
      .el-tabs__header {
        margin-bottom: 24px;
      }
    }
  }

  .el-form-item {
    margin-bottom: 24px;
  }

  .selectClass {
    width: 100%;
  }

  .form-footer {
    padding-left: 100px;
  }

  .diver-title {
    margin-bottom: 24px;
    font-size: 16px;
    font-weight: bold;
    color: #333;
  }

  .tips {
    padding-left: 100px;
    margin-bottom: 24px;
    font-size: 16px;
    color: #ff4d50;
  }
</style>
